<template>
    <div id="everyday">
		<div v-if="big">
			<div class="top">
				<p class="here" @click="handleHere" :style="{left:left}">{{type!==1?'签到':'已签到'}}</P>
				<img class="bg" src="https://khh-server.oss-cn-beijing.aliyuncs.com/resourse/IMG/static/sign/signin_background.png" />
				<img class="posi" src="https://khh-server.oss-cn-beijing.aliyuncs.com/resourse/IMG/static/sign/signin_button.png">
				<div class="imgRight" @click="goCutCoin">
					<img src="https://khh-server.oss-cn-beijing.aliyuncs.com/resourse/IMG/static/sign/gold_b.png">
					<span class="rBtn"><p>{{integral}}</p></span>
					<span class="context">砍币</span>
				</div>
				<div class="box">
					<div class="day">
						<span class="borders"></span>
						<img :src="day<1 ? 'https://khh-server.oss-cn-beijing.aliyuncs.com/resourse/IMG/static/sign/gold_d.png' : 'https://khh-server.oss-cn-beijing.aliyuncs.com/resourse/IMG/static/sign/gold_c.png'">
						<p class="one" style="font-size:.34rem;color:#ffffff">10</p>
						<p :class="day<1 ? 'default': 'active'" style="margin-top: .22rem">第1天</p>
					
					</div>
					<div class="day">
						<img :src="day<2 ? 'https://khh-server.oss-cn-beijing.aliyuncs.com/resourse/IMG/static/sign/gold_d.png' : 'https://khh-server.oss-cn-beijing.aliyuncs.com/resourse/IMG/static/sign/gold_c.png'">
						<p>20</p>
						<p :class="day<2 ? 'default': 'active'" style="margin-top: .22rem">第2天</p>
					</div>
					<div class="day">
						<img :src="day<3 ? 'https://khh-server.oss-cn-beijing.aliyuncs.com/resourse/IMG/static/sign/gold_d.png' : 'https://khh-server.oss-cn-beijing.aliyuncs.com/resourse/IMG/static/sign/gold_c.png'">
						<p>30</p>		
						<p :class="day<3 ? 'default': 'active'" style="margin-top: .22rem">第3天</p>
					</div>
					<div class="day">
						<img :src="day<4 ? 'https://khh-server.oss-cn-beijing.aliyuncs.com/resourse/IMG/static/sign/gold_d.png' : 'https://khh-server.oss-cn-beijing.aliyuncs.com/resourse/IMG/static/sign/gold_c.png'">
						<p>40</p>	
						<p :class="day<4 ? 'default': 'active'" style="margin-top: .22rem">第4天</p>
					</div>
					<div class="day">
						<img :src="day<5 ? 'https://khh-server.oss-cn-beijing.aliyuncs.com/resourse/IMG/static/sign/gold_d.png' : 'https://khh-server.oss-cn-beijing.aliyuncs.com/resourse/IMG/static/sign/gold_c.png'">
						<p>50</p>
						<p :class="day<5 ? 'default': 'active'" style="margin-top: .22rem">第5天</p>
					</div>
					<div class="day">
						<img :src="day<6 ? 'https://khh-server.oss-cn-beijing.aliyuncs.com/resourse/IMG/static/sign/gold_d.png' : 'https://khh-server.oss-cn-beijing.aliyuncs.com/resourse/IMG/static/sign/gold_c.png'">
						<p>60</p>	
						<p :class="day<6 ? 'default': 'active'" style="margin-top: .22rem">第6天</p>
					</div>
					<div class="day">
						<img :src="day<7 ? 'https://khh-server.oss-cn-beijing.aliyuncs.com/resourse/IMG/static/sign/gold_d.png' : 'https://khh-server.oss-cn-beijing.aliyuncs.com/resourse/IMG/static/sign/gold_c.png'">
						<p>70</p>
						<p :class="day<7 ? 'default': 'active'" style="margin-top: .22rem">第7天</p>
					</div>
					<p class="dayP">每日签到领取砍币</p>
				</div>
			</div>
			<div class="bottom">
				<div class="pointsType" >
					<img src="https://khh-server.oss-cn-beijing.aliyuncs.com/resourse/IMG/static/imgChange/play_earn.png" />
					<img @click="goSignin" src="https://khh-server.oss-cn-beijing.aliyuncs.com/resourse/IMG/static/imgChange/lottery_area.png"/>
					<img @click="handlePoin" src="https://khh-server.oss-cn-beijing.aliyuncs.com/resourse/IMG/static/imgChange/expiry_area.png"/>
					<p>每日惊喜赚不停</p>
				</div>
				
				<div class="rule">
					<img src="https://khh-server.oss-cn-beijing.aliyuncs.com/resourse/IMG/static/imgChange/sign_rules.png" />
					<p>1.每个用户每天可签到一次，首次签到领取10砍币，连续第二天可领20砍币，最多每天可获得70砍币 </p>
					<p>2.每轮签到以7天为一周期，连续7天后签到记录清除，重新开始签到</p>
					<p>3.签到期间中断，再次签到重新开始记录</p>
					<p>4.玩转砍币特设抽奖和兑奖专区让您玩转砍币不停歇</p>
					<p>5.本活动最终解释权归砍好货所有</p>
				</div>
			</div>
			<div class="opactive" v-if="opactive" @click="handleClick">
				<img src="https://khh-server.oss-cn-beijing.aliyuncs.com/resourse/IMG/static/sign/close_signin.png">
			</div>
			<div class="posiBox" v-if="text">
				<span class="add">+{{getIntegral}}砍币</span>
				<span class="bBtn" @click="goSignin">去抽奖</span>
			</div>
		</div>
	</div>
</template>

<script>
    import config from "../config/config.js";
	import share from "../share/share.js";
    import store from "../store/newStore.js";
    import MtaH5 from 'mta-h5-analysis';
	export default{
		data(){
			return {
				day:7,
				opactive:false,
				text:false,
				big:true,
				type:'',
				left:"",
                integral:'',
                getIntegral:'',
	
			}
		},
		activated(){
		    share({})
			this.getSignInfo();
            MtaH5.init({
                "sid":'500594815',
                "cid":'500595819',
                "autoReport":0,
                "senseHash":0,
                "senseQuery":0,
                "performanceMonitor":0,
                "ignoreParams":[]
            });
            MtaH5.pgv();
		},
        computed:{
            ticket(){
                return this.$store.state.getTicket;
            }
        },
		methods:{
			goSignin(){
				this.$router.push("/signIn/"+ this.integral)
			},
			handleClick(){
                this.opactive = false,
                this.text = false
			},
			handleHere(){
			    if(this.type==1){

				}else{
                   this.opactive = true,
                   this.text = true;
                    var value=JSON.stringify({"token":localStorage.getItem('token')}),
                        key=demo(value);
                    axios.post('/Home/Integral/DailySign',{
                            value:value,
                            key:key,
						    ticket:this.ticket
                    },config)
                        .then(function(response) {
                            this.day=response.data.data.day;
                            this.type=response.data.data.type;
                            this.integral=response.data.data.integral;
                            this.getIntegral=response.data.data.getIntegral;
                            if(response.data.data.type==1){
                                this.left="3.2rem"
                            }else{
                                this.left="3.38rem"
                            }
                            this.$store.commit('increment',response.data.ticket);
                        }.bind(this))
                        .catch(function (error) {
                            console.log(error);
                        });

				}
			},
			handlePoin(){
				this.$router.push("/signGood")
			},
            getSignInfo(){
                var value=JSON.stringify({"token":localStorage.getItem('token')}),
                    key=demo(value);
                axios.post('/Home/Integral/ShowSignDetails',{
                        value:value,
                        key:key,
                        ticket:this.ticket
                },config)
                    .then(function(response) {
                       this.day=response.data.data.day;
                       this.type=response.data.data.type;
                       this.integral=response.data.data.integral;
					   if(response.data.data.type==1){
					      this.left="3.2rem"
					   }else{
                           this.left="3.38rem"
                       }
                        this.$store.commit('increment',response.data.ticket);
                    }.bind(this))
                    .catch(function (error) {
                        console.log(error);
                    });
			},
            goCutCoin(){
                this.$router.push("/cutCoin")
			}
		}
	
	}
</script>

<style>
    
</style>